<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Chapter 2: I must be Dreaming</title>

<link rel="shortcut icon" href="images/2reading.gif">
<link href="foti.css" rel="stylesheet" type="text/css">

<style type="text/css">
#canvas {
	margin: 10px auto 0 auto;
	border: 5px double #aa9e8c;
}

#bg, #char {display:none;}

</style>

<script type="text/javascript">
var vc, vctx, vi1, bgr;
	function init(){
		vc = document.getElementById("canvas");
		vctx = vc.getContext("2d");
		bgr = document.getElementById("bg");
		vctx.drawImage(bgr,0,0,800,600);
		vi1 = document.getElementById("char");
		setInterval("animation()",1100);		
	}
	
	var dax=0; counter=0;
	function animation(){
		if(counter >= 7) counter = 0; else counter++;
		vctx.drawImage(bgr,0,0,800,600);
		vctx.drawImage(vi1,dax,0,800,600,0,0,800,600);
		dax=800*counter;

	}
</script>

</head>
<body onload="init()">

	<h1>Figment of the Imagination</h1>
	<h2>Chapter 3: Whoever He Is</h2>
	<h2>Alternate Scene 2: Crowd Starts To Jeer</h2>


<center><img src="images/line divider.png" width=800 style="opacity: .7;"></center>

<div id="content">

<center><canvas id="canvas" width=800 height=600></canvas></center>
<img id="bg" src="images/ch3/entrance.png" width=800 height=600>
<img id="char" src="images/ch2/inside.png">

<center><img src="images/photo.png" width=800 style="margin:-4px 0 0 0;"></center>

<div id="scenetext">
<p>
She escaped the embarrassing scene with the people. Ada was furious. She was wondering why 
everyone was suddenly there. The whole crowd bursted to laughter. She found an empty dark room to hide.

</p>

<center><img src="images/line divider.png" width=800 style="opacity: .7;"></center>
	
</div>

<div align="center" style="padding-bottom: 30px;">
<a href="Chapter3Scene2.jsp" title="Pimple Problems"><button id="button">BACK</button></a>
<a href="tableofcontent.jsp" title="Back to Table of Contents"><button id="button2">TABLE OF CONTENTS</button></a>
<a href="Chapter3Scene4.jsp" title="Breakfast"><button id="button">NEXT</button></a>
</div>

</div>


</body>
</html>

